;(function() {
     // 步骤3：创建echarts实例
 let myChart = echarts.init(document.querySelector('.box-m3'))

    let option = { 
        tooltip: {
    trigger: 'axis',
    axisPointer: {
        type: 'cross',
        crossStyle: {
            color: '#999'
        }
    },
    formatter: function (params) {
        // console.log(params); // 当我们想要自定义提示框内容时，可以先将鼠标悬浮的数据打印出来，然后根据需求提取出来即可
        let firstParams = params[0];
        let sndParams = params[1];
        return firstParams.name + '  ' + firstParams.seriesName + '<br>' + ' <br>增长率：' + sndParams.data +' %';
    }
},
     legend: {
         top: 20,
          data: ['销售额', '利润',]
     },
     title: {
         text: '折线图',
         x: 'left',
         textStyle: { //主标题文本样式{"fontSize": 18,"fontWeight": "bolder","color": "#333"}
                "color": "#fff",
            },
     },
  xAxis: [
    {
      axisTick:{ show:false },
      type: 'category',
      data: ['1月', '2月', '3月', '4月', '5月', '6月', '7月', '8月', '9月', '10月', '11月', '12月'],
      }
      
     ],
     grid: {
         bottom:20
     },
  yAxis: [
      {
          type: 'value',
          name: '金额',
          max: 250,
          min: 50,
          axisLine: { show: true },
          axisTick: { show: true },
          splitLine: { show: false },
    },
  ],
  series: [
     {
      name: '销售额',
      type: 'line',
      smooth:true,
      data: [50,100,120,111,142,54,115,122,52,131,121,13]
    },
     {
      name: '利润',
      type: 'line',
      smooth:true,
      data: [211,50,63,121,131,132,111,122,222,131,111,163]
    }
  ]
};

// 步骤5：使用刚指定的配置项和数据显示图表
myChart.setOption(option)

 window.addEventListener('resize',()=>{
     myChart.resize()
 })
})()